<template>
  <a-layout class="a_layout">
    <sidebar></sidebar>
    <a-layout>
      <app-header></app-header>
      <a-layout-content class="a_main_content">
        <app-main></app-main>
      </a-layout-content>
      <a-layout-footer>BEN | {{ $t("message.footer") }}</a-layout-footer>
    </a-layout>
    <setting-drawer></setting-drawer>
  </a-layout>
</template>

<script lang="ts">
import { defineComponent, onMounted } from "vue";
import { AppMain, AppHeader, Sidebar } from "./components/index";
import SettingDrawer from '@/components/Drawer/index.vue'

export default defineComponent({
  name: "Layout",
  props: {},
  components: { AppMain, AppHeader, Sidebar, SettingDrawer },
  setup(props) {},
  //
  mounted() {},
});
</script>

<style lang="scss" scoped>
// layout css
.a_layout {
  position: relative;
  height: 100%;
  .a_main_content {
    padding: 10px 10px 0;
  }
  .ant-layout-footer {
    padding: 10px 50px;
  }
}
</style>